<template>
    <div>
        <div class="container">
            <el-table
                v-loading="loading"
                :data="tableData"
                border
                class="table"
                ref="multipleTable"
                header-cell-class-name="table-header"
            >
                <el-table-column type="index" width="50"></el-table-column>
                <el-table-column label="店铺名称">
                    <template slot-scope="scope">
                        <el-checkbox v-model="scope.row.one">{{scope.row.shopName}}</el-checkbox>
                    </template>
                </el-table-column>
                <el-table-column label="wifi名称" >
                    <template slot-scope="scope">
                        <el-checkbox v-model="scope.row.two">{{scope.row.ssidName}}</el-checkbox>
                    </template>
                </el-table-column>
                <el-table-column label="logo图片" >
                    <template slot-scope="scope">
                        <el-checkbox v-model="scope.row.three">
                            <el-image
                                class="table-td-logo"
                                :src="scope.row.logoId"
                                :preview-src-list="[scope.row.logoId]"
                            ></el-image>
                        </el-checkbox>
                    </template>
                </el-table-column>
                <el-table-column label="营销图片" >
                    <template slot-scope="scope">
                        <el-checkbox v-model="scope.row.four">
                            <el-image
                                class="table-td-logo"
                                :src="scope.row.marketingId"
                                :preview-src-list="[scope.row.marketingId]"
                            ></el-image>
                        </el-checkbox>
                    </template>
                </el-table-column>
                <el-table-column label="批注" align="center">
                    <template slot-scope="scope">
                        <el-input v-model="scope.row.annotation" placeholder="请输入内容"></el-input>
                    </template>
                </el-table-column>

              
                <el-table-column label="操作" width="180" align="center">
                    <template slot-scope="scope">
                        <el-button
                            type="danger"
                            icon="el-icon-delete"
                            @click="handleDelete(scope.$index, scope.row)"
                        >驳回</el-button>
                        <el-button
                            type="success"
                            icon="el-icon-check"
                            @click="handleSuccess(scope.$index, scope.row)"
                        >通过</el-button>
                    </template>
                </el-table-column>
              
            </el-table>
        </div>
        
    </div>
</template>

<script>
export default {
    name: 'onlineManagement',
    data() {
        return {
            tableData: [],
            loading: true,
            form: {},
            
        };
    },
    created() {
        this.getData();
    },
    methods: {
        getData() {
            this.loading = true;
            const u = '/weChatWifiLogin/reviewRecordInfo/queryShopInfoReviews?flag=1';
            this.$axios.get(u,{headers:{'token': localStorage.getItem('manage_wifi_token')}})
            .then((res)=>{
                this.loading = false;
                if(res.data.code == 200){
                    this.tableData = res.data.data;
                }else{
                    this.$message.error(res.data.msg);
                };
            }).catch((err)=>{
                console.log(err);
            
            });
        },
        handleDelete(index,item) {
            // this.loading = true;
            let that = this;
            let params = {
                "reviewInfo": [
                    {
                        "reviewerColumn": item.shopName,
                        "reviewerColumnDesc": "店铺名称",
                        "status": item.one?true:false
                    },
                    {
                        "reviewerColumn": item.ssidName,
                        "reviewerColumnDesc": "wifi名称",
                        "status": item.two?true:false
                    },
                    {
                        "reviewerColumn": item.logoId,
                        "reviewerColumnDesc": 'logo图片',
                        "status": item.three?true:false
                    },
                    {
                        "reviewerColumn": item.marketingId,
                        "reviewerColumnDesc": '营销图片',
                        "status": item.four?true:false
                    }
                ],
                "reviewerContent": item.annotation || '',
                "reviewer": localStorage.getItem('manage_username') || "admin",
                "shopId": item.id,
                "reviewStatus":2
            }
            const url = '/weChatWifiLogin/reviewRecordInfo/queryShopInfoReviews?flag=2&shopId='+item.id;
            const headers = {
                'Content-Type': 'application/json;charset=UTF-8',
                'token': localStorage.getItem('manage_wifi_token')
            };
            this.$axios.post(url, params, {headers}).then((res) => {
                
                if(res.data.code == 200){
                    this.$message.success('操作成功');
                    this.tableData.splice(index, 1); 
                }else{
                    this.$message.error(res.data.msg);
                };
            }).catch((error) => {
                console.warn(error);
            });
        },
        handleSuccess(index,item) {
            // this.loading = true;
            let that = this;
            let params = {
                "reviewInfo": [
                    {
                        "reviewerColumn": item.shopName,
                        "reviewerColumnDesc": "店铺名称",
                        "status": false
                    },
                    {
                        "reviewerColumn": item.ssidName,
                        "reviewerColumnDesc": "wifi名称",
                        "status": false
                    },
                    {
                        "reviewerColumn": item.logoId,
                        "reviewerColumnDesc": 'logo图片',
                        "status": false
                    },
                    {
                        "reviewerColumn": item.marketingId,
                        "reviewerColumnDesc": '营销图片',
                        "status": false
                    }
                ],
                "reviewerContent": item.annotation || '',
                "reviewer": localStorage.getItem('manage_username') || "admin",
                "shopId": item.id,
                "reviewStatus":3
            }
            const url = '/weChatWifiLogin/reviewRecordInfo/queryShopInfoReviews?flag=1&shopId='+item.id;
            const headers = {
                'Content-Type': 'application/json;charset=UTF-8',
                'token': localStorage.getItem('manage_wifi_token')
            };
            this.$axios.post(url, params, {headers}).then((res) => {
                
                if(res.data.code == 200){
                    this.$message.success('操作成功');
                    this.tableData.splice(index, 1); 
                }else{
                    this.$message.error(res.data.msg);
                };
            }).catch((error) => {
                console.warn(error);
            });
        }
    }
};
</script>

<style scoped lang="less">
.table {
    width: 100%;
    font-size: 14px;
}
.pagination {
    margin: 20px 0;
    text-align: right;
}

.table-td-logo {
    display: block;
    margin: auto;
    width: 40px;
    height: 40px;
}
</style>
